import React, { Component } from 'react';

// import './HeadStyleComp.css'

import styled from 'styled-components'


// import {themaColor} from '../../assets/thema/index'
import '../../static/iconfont.css'

const HeadContair = styled.header`
    width:100%;
    height:.45rem;
    border-bottom:1px solid #eee
    display:flex;
    line-height:.45rem;
    text-align:center;
    i{
        flex:41
    }
    b{
        width:.4rem;
        height:.45rem;
        background:url('/img_my/NavButtonBack_new.png') no-repeat center center;
        background-size:.10rem;
    }
    a{
        margin-right:.1rem;
    }
    .firsti{
        font-size:.18rem
    }
    .secondi{
        font-size:.2rem
    }
    div{
        flex:293
    }
`
const Title = styled.div`
flex:274;
height:100%
color:#fff;
font-weight:700
font-size:.18rem
`



class Head extends Component {
    constructor() {
        super()
        this.state = {

        }
    }

    back = () => {
        this.props.history.go(-1)
    }
    gohome = () => {
        this.props.history.push('/home/homemain/today')
    }


    goSwitch = () => {
        if (this.props.MyLoginSpan === '登录') {
            this.props.history.push('/mine/login')
        } else if (this.props.MyLoginSpan === '注册') {
            this.props.history.push('/mine/register')
        }
    }



    render() {

        return (
            <HeadContair>
                {
                    this.props.MyLoginBackFlag && <b onClick={this.back}></b>
                    ||
                    <i className="iconfont firsti" onClick={this.back}>&#xe609;</i>
                }
                <div>{this.props.biaoti}</div>
                {
                    this.props.MyLoginBackFlag && <a onClick={this.goSwitch}>{this.props.MyLoginSpan}</a>
                    ||
                    <i className="iconfont secondi" onClick={this.gohome}>&#xe64a;</i>
                }

            </HeadContair>
        )
    }
}

export default Head